<!DOCTYPE html>
<html lang=zh>
<head>
    <!-- so meta -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="HandheldFriendly" content="True">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <meta name="description" content="每一个app都有一个入口，我们使用angular-cli构建应用，angular-cli是在一个叫webpack的工具之上构建的。我们使用Angular时可以先不用理解webpack，但是我们了解一下Angular 2 应用是怎样启动的还是非常有用处的。
我们使用angular-cli工具的命令来启动应用，命令如下：
1ng serve
这个命令会去angular-cli.json中查找进入app">
<meta property="og:type" content="article">
<meta property="og:title" content="Angular 2 应用启动过程简单分析">
<meta property="og:url" content="http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/index.html">
<meta property="og:site_name" content="SitHome">
<meta property="og:description" content="每一个app都有一个入口，我们使用angular-cli构建应用，angular-cli是在一个叫webpack的工具之上构建的。我们使用Angular时可以先不用理解webpack，但是我们了解一下Angular 2 应用是怎样启动的还是非常有用处的。
我们使用angular-cli工具的命令来启动应用，命令如下：
1ng serve
这个命令会去angular-cli.json中查找进入app">
<meta property="og:updated_time" content="2017-02-11T02:50:06.000Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Angular 2 应用启动过程简单分析">
<meta name="twitter:description" content="每一个app都有一个入口，我们使用angular-cli构建应用，angular-cli是在一个叫webpack的工具之上构建的。我们使用Angular时可以先不用理解webpack，但是我们了解一下Angular 2 应用是怎样启动的还是非常有用处的。
我们使用angular-cli工具的命令来启动应用，命令如下：
1ng serve
这个命令会去angular-cli.json中查找进入app">
    
    
        
          
              <link rel="shortcut icon" href="/images/favicon.ico">
          
        
        
          
            <link rel="icon" type="image/png" href="/images/favicon-192x192.png" sizes="192x192">
          
        
        
          
            <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
          
        
    
    <!-- title -->
    <title>Angular 2 应用启动过程简单分析</title>
    <!-- styles -->
    <link rel="stylesheet" href="/lib/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/lib/meslo-LG/styles.css">
    <link rel="stylesheet" href="/lib/justified-gallery/justifiedGallery.min.css">
    <link rel="stylesheet" href="/css/style.css">
    <!-- rss -->
    
    
    <!-- jquery -->
    <script src="/lib/jquery/jquery.min.js"></script>
</head>

<body>
    
      <div id="header-post">
  <a id="menu-icon" href="#"><i class="fa fa-bars fa-lg"></i></a>
  <a id="menu-icon-tablet" href="#"><i class="fa fa-bars fa-lg"></i></a>
  <a id="top-icon-tablet" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');" style="display:none;"><i class="fa fa-chevron-up fa-lg"></i></a>
  <span id="menu">
    <span id="nav">
      <ul>
        
          <li><a href="/">主页</a></li>
        
          <li><a href="/about/">关于</a></li>
        
          <li><a href="/archives/">文章</a></li>
        
          <li><a href="https://git.oschina.net/sithome">码云</a></li>
        
      </ul>
    </span>
    <br/>
    <span id="actions">
      <ul>
        
        
        <li><a class="icon" href="/2017/02/04/angular2-component-2/"><i class="fa fa-chevron-right" aria-hidden="true" onmouseover='$("#i-next").toggle();' onmouseout='$("#i-next").toggle();'></i></a></li>
        
        <li><a class="icon" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');"><i class="fa fa-chevron-up" aria-hidden="true" onmouseover='$("#i-top").toggle();' onmouseout='$("#i-top").toggle();'></i></a></li>
        <li><a class="icon" href="#"><i class="fa fa-share-alt" aria-hidden="true" onmouseover='$("#i-share").toggle();' onmouseout='$("#i-share").toggle();' onclick='$("#share").toggle();return false;'></i></a></li>
      </ul>
      <span id="i-prev" class="info" style="display:none;">Previous post</span>
      <span id="i-next" class="info" style="display:none;">Next post</span>
      <span id="i-top" class="info" style="display:none;">Back to top</span>
      <span id="i-share" class="info" style="display:none;">Share post</span>
    </span>
    <br/>
    <div id="share" style="display: none">
      <ul>
  <li><a class="icon" href="http://www.facebook.com/sharer.php?u=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/"><i class="fa fa-facebook " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="https://twitter.com/share?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&text=Angular 2 应用启动过程简单分析"><i class="fa fa-twitter " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://www.linkedin.com/shareArticle?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-linkedin " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="https://pinterest.com/pin/create/bookmarklet/?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&is_video=false&description=Angular 2 应用启动过程简单分析"><i class="fa fa-pinterest " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="mailto:?subject=Angular 2 应用启动过程简单分析&body=Check out this article: http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/"><i class="fa fa-envelope " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="https://getpocket.com/save?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-get-pocket " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://reddit.com/submit?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-reddit " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://www.stumbleupon.com/submit?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-stumbleupon " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://digg.com/submit?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-digg " aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://www.tumblr.com/share/link?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&name=Angular 2 应用启动过程简单分析&description="><i class="fa fa-tumblr " aria-hidden="true"></i></a></li>
</ul>

    </div>
    <div id="toc">
      <ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#第一步——angular-cli-json"><span class="toc-number">1.</span> <span class="toc-text">第一步——angular-cli.json</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#第二步——main-ts"><span class="toc-number">2.</span> <span class="toc-text">第二步——main.ts</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#第三步——app-module-ts"><span class="toc-number">3.</span> <span class="toc-text">第三步——app.module.ts</span></a></li></ol>
    </div>
  </span>

</div>

    
    <div class="content index width mx-auto px2 my4">
        
        <article class="post" itemscope itemtype="http://schema.org/BlogPosting">
  <header>
    
    <h1 class="posttitle" itemprop="name headline">
        Angular 2 应用启动过程简单分析
    </h1>



    <div class="meta">
      <span class="author" itemprop="author" itemscope itemtype="http://schema.org/Person">
        <span itemprop="name">SitHome</span>
      </span>
      
    <div class="postdate">
        <time datetime="2017-02-11T02:44:17.000Z" itemprop="datePublished">2017-02-11</time>
    </div>


      

    </div>
  </header>
  

  <div class="content" itemprop="articleBody">
    <p>每一个app都有一个入口，我们使用angular-cli构建应用，angular-cli是在一个叫webpack的工具之上构建的。我们使用Angular时可以先不用理解webpack，但是我们了解一下Angular 2 应用是怎样启动的还是非常有用处的。</p>
<p>我们使用angular-cli工具的命令来启动应用，命令如下：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">ng serve</div></pre></td></tr></table></figure>
<p>这个命令会去angular-cli.json中查找进入app的入口。下面一步一步的看看是怎样找到我们创建的组件的。</p>
<h1 id="第一步——angular-cli-json"><a href="#第一步——angular-cli-json" class="headerlink" title="第一步——angular-cli.json"></a>第一步——angular-cli.json</h1><p>angular-cli.json文件在项目的跟目录下：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div></pre></td><td class="code"><pre><div class="line">SitHome-MacBook-Pro:helloWorld sithome$ tree -L 1</div><div class="line">.</div><div class="line">├── README.md</div><div class="line">├── angular-cli.json</div><div class="line">├── dist</div><div class="line">├── e2e</div><div class="line">├── karma.conf.js</div><div class="line">├── node_modules</div><div class="line">├── package.json</div><div class="line">├── protractor.conf.js</div><div class="line">├── src</div><div class="line">└── tslint.json</div><div class="line"></div><div class="line">4 directories, 6 files</div></pre></td></tr></table></figure>
<p>angular-cli.json中描述了一个主要的文件，关键字main对应的文件“main.ts”，如下所示：</p>
<figure class="highlight"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div></pre></td><td class="code"><pre><div class="line">&#123;</div><div class="line">  "project": &#123;</div><div class="line">    "version": "1.0.0-beta.26",</div><div class="line">    "name": "helloworld"</div><div class="line">  &#125;,</div><div class="line">  "apps": [</div><div class="line">    &#123;</div><div class="line">      "root": "src",</div><div class="line">      "outDir": "dist",</div><div class="line">      "assets": [</div><div class="line">        "assets",</div><div class="line">        "favicon.ico"</div><div class="line">      ],</div><div class="line">      "index": "index.html",</div><div class="line">      "main": "main.ts",</div><div class="line">      "test": "test.ts",</div><div class="line">      "tsconfig": "tsconfig.json",</div><div class="line">      "prefix": "app",</div><div class="line">      "mobile": false,</div><div class="line">      "styles": [</div><div class="line">        "styles.css"</div><div class="line">      ]</div><div class="line"></div><div class="line">    &#125;]</div><div class="line">&#125;</div><div class="line">//more...</div></pre></td></tr></table></figure>
<p>main.ts文件是应用的入口，它来引导应用的启动。</p>
<h1 id="第二步——main-ts"><a href="#第二步——main-ts" class="headerlink" title="第二步——main.ts"></a>第二步——main.ts</h1><p>main.ts在项目的src目录下：</p>
<figure class="highlight bash"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div></pre></td><td class="code"><pre><div class="line">SitHome-MacBook-Pro:helloWorld sithome$ tree src/ -L 1</div><div class="line">src/</div><div class="line">├── app</div><div class="line">├── assets</div><div class="line">├── environments</div><div class="line">├── favicon.ico</div><div class="line">├── index.html</div><div class="line">├── main.ts</div><div class="line">├── polyfills.ts</div><div class="line">├── styles.css</div><div class="line">├── test.ts</div><div class="line">└── tsconfig.json</div><div class="line"></div><div class="line"></div><div class="line">3 directories, 7 files</div></pre></td></tr></table></figure>
<p>启动程序会根据main.ts中的内容启动一个Angular模块，至于模块是怎么回事先不用深入理解，目前只需知道有这个个概念就行。main.ts的内容如下：</p>
<figure class="highlight typescript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div></pre></td><td class="code"><pre><div class="line"><span class="keyword">import</span> &#123; platformBrowserDynamic &#125; from <span class="string">'@angular/platform-browser-dynamic'</span>;</div><div class="line"><span class="keyword">import</span> &#123; enableProdMode &#125; from <span class="string">'@angular/core'</span>;</div><div class="line"><span class="keyword">import</span> &#123; environment &#125; from <span class="string">'./environments/environment'</span>;</div><div class="line"><span class="keyword">import</span> &#123; AppModule &#125; from <span class="string">'./app/app.module'</span>;</div><div class="line"></div><div class="line"><span class="keyword">if</span> (environment.production) &#123;</div><div class="line">  enableProdMode();</div><div class="line">&#125;</div><div class="line"></div><div class="line">platformBrowserDynamic().bootstrapModule(AppModule);</div></pre></td></tr></table></figure>
<p>“platformBrowserDynamic().bootstrapModule(AppModule);”语句说明会启动名字为AppModule的模块。”import { AppModule } from ‘./app/app.module’;”语句说明AppModule模块在src/app/app.module.ts文件中定义。</p>
<h1 id="第三步——app-module-ts"><a href="#第三步——app-module-ts" class="headerlink" title="第三步——app.module.ts"></a>第三步——app.module.ts</h1><p>app.module.ts的内容如下：</p>
<figure class="highlight typescript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div></pre></td><td class="code"><pre><div class="line"><span class="keyword">import</span> &#123; BrowserModule &#125; from <span class="string">'@angular/platform-browser'</span>;</div><div class="line"><span class="keyword">import</span> &#123; NgModule &#125; from <span class="string">'@angular/core'</span>;</div><div class="line"><span class="keyword">import</span> &#123; FormsModule &#125; from <span class="string">'@angular/forms'</span>;</div><div class="line"><span class="keyword">import</span> &#123; HttpModule &#125; from <span class="string">'@angular/http'</span>;</div><div class="line"></div><div class="line"><span class="keyword">import</span> &#123; AppComponent &#125; from <span class="string">'./app.component'</span>;</div><div class="line"><span class="keyword">import</span> &#123; HelloWorldComponent &#125; from <span class="string">'./hello-world/hello-world.component'</span>;</div><div class="line"><span class="keyword">import</span> &#123; UserItemComponent &#125; from <span class="string">'./user-item/user-item.component'</span>;</div><div class="line"><span class="keyword">import</span> &#123; UserListComponent &#125; from <span class="string">'./user-list/user-list.component'</span>;</div><div class="line"></div><div class="line"><span class="meta">@NgModule</span>(&#123;</div><div class="line">  declarations: [</div><div class="line">    AppComponent,</div><div class="line">    HelloWorldComponent,</div><div class="line">    UserItemComponent,</div><div class="line">    UserListComponent</div><div class="line">  ],</div><div class="line">  imports: [</div><div class="line">    BrowserModule,</div><div class="line">    FormsModule,</div><div class="line">    HttpModule</div><div class="line">  ],</div><div class="line">  providers: [],</div><div class="line">  bootstrap: [AppComponent]</div><div class="line">&#125;)</div><div class="line"><span class="keyword">export</span> <span class="keyword">class</span> AppModule &#123; &#125;</div></pre></td></tr></table></figure>
<p>从app.module.ts内容可以知道AppModule是一个class，AppModule由注解@NgModule标注。注解@NgModule标注有三个关键的key：declarations,imports,bootstrap.</p>
<p>declarations说明了模块中定义的组件。可以注意到使用”ng generate”命令创建的组件会自动添加到这里。Angular规定只有在模块中申明的组件的才能在模本中使用。</p>
<p>imports描述了组件依赖的模块，如我们想使用浏览器，得依赖BrowserModule模块。</p>
<p>bootstrap说明要启动组件为AppComponent，AppComponent组件为应用的跟组件。</p>
<p>到此已经大致了解了应用启动时怎么找到我们自己定义的组件。</p>

  </div>
</article>

    <div class="weixin">
      <p>欢迎关注微信SitHomeBing，互相交流学习</p>
      <p><img src="http://okhdvenip.bkt.clouddn.com/qrcode8.jpg" alt="SitHomeBing" title="微信扫二维码关注"></p>
    </div>





<!-- 多说评论框 start -->
	<div class="ds-thread" data-thread-key="2017/02/11/angular-2-bootstrap-process/" data-title="Angular 2 应用启动过程简单分析" data-url="http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/"></div>
<!-- 多说评论框 end -->



    </div>
    
      <div id="footer-post-container">
  <div id="footer-post">

    <div id="nav-footer" style="display: none">
      <ul>
         
          <li><a href="/">主页</a></li>
         
          <li><a href="/about/">关于</a></li>
         
          <li><a href="/archives/">文章</a></li>
         
          <li><a href="https://git.oschina.net/sithome">码云</a></li>
        
      </ul>
    </div>

    <div id="toc-footer" style="display: none">
      <ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#第一步——angular-cli-json"><span class="toc-number">1.</span> <span class="toc-text">第一步——angular-cli.json</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#第二步——main-ts"><span class="toc-number">2.</span> <span class="toc-text">第二步——main.ts</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#第三步——app-module-ts"><span class="toc-number">3.</span> <span class="toc-text">第三步——app.module.ts</span></a></li></ol>
    </div>

    <div id="share-footer" style="display: none">
      <ul>
  <li><a class="icon" href="http://www.facebook.com/sharer.php?u=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/"><i class="fa fa-facebook fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="https://twitter.com/share?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&text=Angular 2 应用启动过程简单分析"><i class="fa fa-twitter fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://www.linkedin.com/shareArticle?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-linkedin fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="https://pinterest.com/pin/create/bookmarklet/?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&is_video=false&description=Angular 2 应用启动过程简单分析"><i class="fa fa-pinterest fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="mailto:?subject=Angular 2 应用启动过程简单分析&body=Check out this article: http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/"><i class="fa fa-envelope fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="https://getpocket.com/save?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-get-pocket fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://reddit.com/submit?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-reddit fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://www.stumbleupon.com/submit?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-stumbleupon fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://digg.com/submit?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&title=Angular 2 应用启动过程简单分析"><i class="fa fa-digg fa-lg" aria-hidden="true"></i></a></li>
  <li><a class="icon" href="http://www.tumblr.com/share/link?url=http://www.sithome.vip/2017/02/11/angular-2-bootstrap-process/&name=Angular 2 应用启动过程简单分析&description="><i class="fa fa-tumblr fa-lg" aria-hidden="true"></i></a></li>
</ul>

    </div>

    <div id="actions-footer">
      <ul>
        <li id="toc"><a class="icon" href="#" onclick='$("#toc-footer").toggle();return false;'><i class="fa fa-list fa-lg" aria-hidden="true"></i> TOC</a></li>
        <li id="share"><a class="icon" href="#" onclick='$("#share-footer").toggle();return false;'><i class="fa fa-share-alt fa-lg" aria-hidden="true"></i> Share</a></li>
        <li id="top" style="display:none"><a class="icon" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');"><i class="fa fa-chevron-up fa-lg" aria-hidden="true"></i> Top</a></li>
        <li id="menu"><a class="icon" href="#" onclick='$("#nav-footer").toggle();return false;'><i class="fa fa-bars fa-lg" aria-hidden="true"></i> Menu</a></li>
      </ul>
    </div>

  </div>
</div>

    
    <footer id="footer">
  <div class="footer-left">
    Copyright &copy; 2017 SitHome
  </div>
  <div class="footer-right">
    <nav>
      <ul>
         
          <li><a href="/">主页</a></li>
         
          <li><a href="/about/">关于</a></li>
         
          <li><a href="/archives/">文章</a></li>
         
          <li><a href="https://git.oschina.net/sithome">码云</a></li>
        
      </ul>
    </nav>
  </div>
</footer>

    <script src="/lib/justified-gallery/jquery.justifiedGallery.min.js"></script>
<script src="/js/main.js"></script>
<!-- Google Analytics -->
<!--

    <script type="text/javascript">
        (function(i,s,o,g,r,a,m) {i['GoogleAnalyticsObject']=r;i[r]=i[r]||function() {
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
        ga('create', 'UA-86660611-1', 'auto');
        ga('send', 'pageview');
    </script>

-->
<!-- Disqus Comments -->


<!--duoshuo comments-->

  <!-- 多说公共JS代码 start (一个网页只需插入一次) -->
  <script type="text/javascript">
  var duoshuo_shortname = 'sithome';
  var duoshuoQuery = {short_name:duoshuo_shortname};
    (function() {
      var ds = document.createElement('script');
      ds.type = 'text/javascript';ds.async = true;
      ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com/embed.js';
      ds.charset = 'UTF-8';
      (document.getElementsByTagName('head')[0]
       || document.getElementsByTagName('body')[0]).appendChild(ds);
    })();
    </script>
  <!-- 多说公共JS代码 end -->


</body>
</html>
